import 'dart:async';
import 'package:card_swiper/card_swiper.dart';
import 'package:flutter/material.dart';
import 'package:flutter_project/common/route_page/route_name.dart';
import 'package:flutter_project/config/theme_color.dart';
import 'package:flutter_project/home/app_main_page.dart';

class GuideSwiperPage extends StatefulWidget {
  const GuideSwiperPage({super.key});

  @override
  State<GuideSwiperPage> createState() => _GuideSwiperPageState();
}

class _GuideSwiperPageState extends State<GuideSwiperPage> {
  final ValueNotifier<int> currentIndex = ValueNotifier<int>(0);
  List images = [
    'assets/images/guide_pages/guide_pages_1.png',
    'assets/images/guide_pages/guide_pages_2.png',
    'assets/images/guide_pages/guide_pages_3.png',
    'assets/images/guide_pages/guide_pages_4.png'
  ];
  final ValueNotifier<int> timerCount = ValueNotifier<int>(5);
  Timer? countTimer;

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Swiper(
          itemBuilder: (context, index) {
            final image = images[index];
            return Container(
              color: Colors.white,
              child: Image.asset(
                image,
                //fit: BoxFit.fill,
              ),
            );
          },
          onIndexChanged: (index) {
            currentIndex.value = index;
          },
          indicatorLayout: PageIndicatorLayout.COLOR,
          autoplay: false,
          itemCount: images.length,
          loop: false,
          pagination: SwiperPagination(
              builder: DotSwiperPaginationBuilder(
                  activeColor: ThemeColor.mainColor,
                  color: ThemeColor.textColorSecond,
                  space: 10)),
          control: const SwiperControl(),
        ),
        Positioned(
            right: 20,
            top: 40,
            child: TextButton(
              onPressed: () {
                RouteNames.pushReplacement(const AppMainPage());
              },
              child: Container(
                alignment: Alignment.center,
                width: 100,
                height: 30,
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(4),
                    color: ThemeColor.mainColor),
                child: ValueListenableBuilder(
                    valueListenable: timerCount,
                    builder: (BuildContext context, int value, Widget? child) {
                      return Text(
                        '跳过${timerCount.value}s',
                        style: const TextStyle(color: Colors.white),
                      );
                    }),
              ),
            )),
        Positioned(
            left: 0,
            right: 0,
            bottom: 80,
            child: ValueListenableBuilder(
                valueListenable: currentIndex,
                builder: (BuildContext context, int value, Widget? child) {
                  return Visibility(
                    visible: value == images.length - 1,
                    child: TextButton(
                      onPressed: () {
                        RouteNames.pushReplacement(const AppMainPage());
                      },
                      child: Container(
                        alignment: Alignment.center,
                        width: 120,
                        height: 35,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(20),
                            color: ThemeColor.mainColor),
                        child: const Text(
                          '进入App',
                          style: TextStyle(color: Colors.white),
                        ),
                      ),
                    ),
                  );
                })),
      ],
    );
  }

  @override
  void initState() {
    super.initState();
    countTimer = Timer.periodic(const Duration(seconds: 1), (timer) {
      if (timerCount.value > 0) {
        timerCount.value--;
      } else {
        cancelTimer();
         RouteNames.pushReplacement(const AppMainPage());
      }
    });
  }

  //取消定时器
  void cancelTimer() {
    if (countTimer != null && countTimer!.isActive) {
      countTimer!.cancel();
    }
    debugPrint('取消了定时器');
  }

  @override
  void dispose() {
    super.dispose();
    cancelTimer();
  }
}
